<template>
  <div class="switch">
    <div class="switch__circle"></div>
    <div class="switch__circle switch__circle--t"></div>
    <div class="switch__container">
      <h2 class="switch__title title">{{ title }}</h2>
      <p class="switch__description description">{{ description }}</p>

      <n-button type="primary" @click="clickSwitch">{{ buttonText }}</n-button>
    </div>
  </div>
</template>

<script setup>

const emit = defineEmits(['switch'])
const props = defineProps({
  title: String,
  description: String,
  buttonText: String,
})

function clickSwitch() {
  emit('switch')
}

</script>

<style scoped>
@import '../../css/login.css';

/*
将源码中的css样式单独存放,在各组件中导入就可以。
后续整理代码时建议，将全局样式和局部样式分开。
*/
</style>